

<template>
  <div v-if="!toolStore.isError.status">
    <!-- 信息栏使用 -->

    <n-dialog-provider>
      <n-notification-provider>
        <n-message-provider>
          <n-layout has-sider class="root-n-layout">
            <!-- 导航菜单 -->
            <navigation-menu></navigation-menu>
            <!-- 内容布局 -->
            <n-layout class="right-layout">

              <!-- 顶部标题栏 -->
              <title-bar class="title-bar"></title-bar>

              <!-- 中间内容区域 -->
              <n-layout class="n-layout-body"
                :content-style="'padding:5px;max-width: 100%;height:' + windowHeight + 'px;'" :native-scrollbar="false">
                <!-- 路由组件 -->
                <router-view v-slot="{ Component }">
                  <transition>
                    <keep-alive v-if="iskeepAlive">
                      <component :is="Component" />
                    </keep-alive>
                    <component v-else :is="Component" />
                  </transition>
                </router-view>

              </n-layout>

            </n-layout>

          </n-layout>
        </n-message-provider>

      </n-notification-provider>
    </n-dialog-provider>
  </div>

  <n-result v-else status="error" title="错误" :description="toolStore.isError.msg">
    <template #footer>
      <n-button v-for="(text, index) in toolStore.isError.btn" :key="index" @click="runErrorCall(index)">{{ text
      }}</n-button>
    </template>
  </n-result>
</template>

<script setup>
import { ref, onMounted, nextTick } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import navigationMenu from "@renderer/components/navigation-menu.vue";
import titleBar from "@renderer/components/title-bar.vue";
import { useToolStore, useMainStore } from './store';
import { getResPackages } from '@renderer/assets/common/api';


const toolStore = useToolStore();
const mainStore = useMainStore();
const router = useRouter();
let { ipcRenderer } = window.electron;


/**
 * 获取最新的 资源包列表
 */
getResPackages().then(res => {
  mainStore.resPackages = res;
});

let windowHeight = ref(700 - 61);

// 当前路由是否需要缓存
let iskeepAlive = ref(false);
// 每次路由更新后
router.afterEach((to, from) => {
  iskeepAlive.value = to.meta?.keepAlive;
});

// 初始化
window.api.oneinitSetting();//初始化设置配置文件 （如果文件不在才会设置 如果在了不会覆盖的）



// 监听窗口大小变化
ipcRenderer.on('update-win-size', (e, data) => {
  windowHeight.value = data[1] - 61;
});

/**
 * 监听主进程的路由跳转
 */
ipcRenderer.on('router_to', (e, data) => {
  router.replace(data);
});


onMounted(() => {
  toolStore.getSetting();
});


/**
 * 运行错误的回调方法
 */
function runErrorCall(index) {
  toolStore.isError.callback[index]();
}

</script>

<style lang="scss">
// 全局样式
@import '@renderer/assets/css/styles.scss';
// 自定义图标库
@import '@renderer/assets/css/iconfont.css';

.n-result {
  margin-top: 20%;
}
</style>
